<template>
  <div>
    <List ref="defaultList" :loadapi="loadapi" :filterapi="filterapi">
      <template v-slot:searchBar="slotProps">
        <SearchBar :keyword="slotProps.condition" :placeholder="slotProps.placeholder" :viewoptionArr="slotProps.viewoptionArr" @handleClickViewOption="slotProps.handleClickViewOption" @hanldeClickFilter="slotProps.hanldeClickFilter" @handleClickSearch="slotProps.handleClickSearch" @handleInputSearch="slotProps.handleInputSearch"></SearchBar>
      </template>

      <template v-slot:listItem="slotProps">
        <div class="L-box">
          <BaseItem :idobject="route.query.idobject" :item="slotProps.itemData" :idtemplate="route.query.idtemplate"></BaseItem>
        </div>
      </template>
    </List>
  </div>
</template>
  
  <script setup lang="ts" name="contact">
import List from "@/components/common/List.vue";
import BaseItem from "@/components/base/List/BaseItem.vue";
import SearchBar from "@/components/common/SearchBar.vue";
import { ref, onActivated, onMounted } from "vue";
import { useRoute } from "vue-router";

const route = useRoute();

const idobject = ref(route.query.idobject);
const idtemplate = ref(route.query.idtemplate);
const stitle = ref(route.query.stitle);

const defaultList = ref(null);

const loadapi = ref(`${route.query.idobject as string}.list.do`);
const filterapi = ref(`${route.query.idobject as string}.query.do`);

// onActivated(() => {
//   idobject.value = route.query.idobject as string;
//   idtemplate.value = route.query.idtemplate as string;
//   stitle.value = route.query.stitle as string;

//   loadapi.value = `${route.query.idobject as string}.list.do`;
//   filterapi.value = `${route.query.idobject as string}.query.do`;

// });
onActivated(() => {
  // console.log("onActivated")
  sessionStorage.setItem("stitle",route.query.stitle as string || "渠道管理")
  document.title = sessionStorage.getItem("stitle")
})
onMounted(()=>{
  // console.log("onMounted")
  sessionStorage.setItem("stitle",route.query.stitle as string || "渠道管理")
  document.title = sessionStorage.getItem("stitle")
})
</script>
  
  <style>
.L-avatar-box {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #409eff;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>